<template>
	<uni-collapse-item name="wallet">
		<template v-slot:title>
			<view class="gl-header">
				<view class="gl-header-left" style="align-items: center;">
					<uni-icons type="star" size="16" color="#007aff"></uni-icons>
					<text style="font-weight: bold;">{{title}}</text>
					<text>{{zipPrice(firstMoney)}}</text>
				</view>
				<view class="gl-header-right">
					<view v-if="curItem==='wallet'" class="gl-link gl-link-error" style="padding-right: 5px;"
						@click.stop="sendChange">充值</view>
					<view v-if="curItem==='wallet'" class="gl-link gl-link-base" style="padding-right: 20px;"
						@click.stop="open(null)">刷新</view>
				</view>
			</view>
		</template>
		<view class="content">
			<scroll-view scroll-y="true" style="height: 30vh;" @scrolltolower="scrollChange">
				<uni-list>
					<uni-list-item v-if="couponList.length === 0" title="---没有找到数据记录---"></uni-list-item>
					<uni-list-item v-for="(item, index) in couponList" :key="index" direction="row"
						:disabled="item.status===0" style="width: 100%;">
						<template v-slot:header>
							<view class="slot-box"></view>
						</template>
						<template v-slot:body>
							<view style="display: flex;width: 100%;gap: 20px;">
								<view style="display: flex;flex-direction: column;">
									<text style="font-size: smaller;">{{item.reqsn}}</text>
									<text style="font-size: small;color: #999;">{{item.create}}</text>
								</view>
								<view style="display: flex;gap: 20px;font-size: small;">
									<text>{{item.tos}}</text>
									<text :style="{color:zipState(item.mark)}">{{zipPrice(item.money)}}</text>
								</view>
							</view>
						</template>
						<template v-slot:footer>
							<view style="width: 128px;text-align:right;">
								<text style="font-size: small;color:#007aff">{{zipPrice(item.amount)}}</text>
							</view>
						</template>
					</uni-list-item>
				</uni-list>
			</scroll-view>

			<!-- 模态窗口 -->
			<popAddwalletCardVue ref="popAddwalletCard" @refresh="open(null)"></popAddwalletCardVue>

		</view>
	</uni-collapse-item>
</template>

<script>
	import psMethod from '@/common/psMethod';
	import psLib from '@/common/psLib';	
	import popAddwalletCardVue from './pop-addwallet-card.vue';
	export default {
		data() {
			return {
				count: 0, // 记录数
				size: 50, // 页大小
				page: 1, // 当前页
				curpage: 0,
				title: '个人钱包',
				sConf: getApp().globalData,
				couponList: [], // 主数据列表 
				sid: null,
				firstMoney: 0,
			}
		},
		props: {
			curItem: {
				type: String,
				default: null
			}
		},
		components: {
			popAddwalletCardVue
		},
		methods: {
			open(e = null) {
				console.log('open', e);
				if (e !== null) {
					this.sid = e
				}
				this.page = 1
				this.curpage = 0
				this.couponList = []
				this.loadDefData()
			},
			async loadDefData() {
				await this.loadMyCouponList().then(res => {
					console.log('加载代金券', res);
					if (this.page > this.curpage) {
						this.couponList = this.couponList.concat(res.resmsg)
						this.count = res.count
						this.size = res.size
						this.curpage = this.page
					}
					if (this.page === 1 && this.couponList.length > 0) {
						this.firstMoney = res.resmsg[0].amount
					}
				})
			},
			scrollChange() {
				console.log('scrollChange');
				console.log(this.page, this.size, this.count);
				let allPage = Math.ceil(this.count / this.size)
				console.log(allPage);
				if (this.page < allPage) {
					this.page++
					this.loadDefData()
				}
			},
			sendChange() {
				console.log('sendChange');
				this.$refs.popAddwalletCard.open(this.sid)
			},
			loadMyCouponList() {
				let host = this.sConf.host + '/admin/walletList/';
				let token = this.sConf.auth.token || '';
				let data = {
					sid: this.sid,
					page: this.page,
					ordering: '-id'
				}
				console.log('请求参数->', data);
				return new Promise((resolve, reject) => {
					psMethod.authenticatorGetSync(host, token, data).then(res => {
						resolve(res)
					}).catch(err => {
						reject(err)
					})
				})
			},
			zipPrice(e) {
				return '￥' + (e / 100).toFixed(2) + '元'
			},
			zipCalcTimer(e) {
				let timer = psLib.zipCalcTimer(e)
				if (timer < 0) {
					return '#dd524d'
				} else if (timer < 3600 * 24 * 10) {
					return '#f0ad4e'
				} else {
					return '#999'
				}
			},
			zipState(e) {
				if (e === 1) {
					return '#4cd964'
				} else if (e === -1) {
					return '#dd524d'
				} else {
					return '#999'
				}
			}
		}
	}
</script>

<style lang="scss" scoped>

</style>